<template>
  <div v-if="!myShow">
    <el-popover placement="bottom" min-width trigger="click" v-model="popoverShow" :disabled="disable">
      <div style="min-width: 150px;
        min-height: 200px;
        max-height: 300px;
        overflow:auto;">
        <el-tree :data="treedata" node-key="BRANCHNO" :default-expanded-keys="[80999]" :expand-on-click-node="false" :props="defaultProps" @node-click="handleNodeClick">
        </el-tree>
      </div>
      <el-input slot="reference" v-model="branch" :disabled="disable" placeholder="请选择机构"></el-input>
    </el-popover>
  </div>
  <div v-else>
    <el-tree :data="treedata" default-expand-all :expand-on-click-node="false" :props="defaultProps" @node-click="handleNodeClick">
    </el-tree>
  </div>
</template>

<script>
import request from "@/common/utils/requestWFM";
import branchQuery from '@/message/wfm/baseData/branchManage/branchQuery'
  //依赖elementui
  //目前将点选择设值为单个独立选择
  export default {
    mounted() {
      this.$nextTick(()=>{
        this.branch = this.branchName
      })
    },
    props:{
      branch: String,
      disable: Boolean,
      myShow: Boolean
    },
    watch: {
    },
    name: "selectTree",
    data() {
      return {
        branchName: this.branch,
        branchNO: '',
        defaultProps: {
          children: 'children',
          label: 'BRANCHNAME'
        },
        popoverShow: false,
        resData: "",
        treedata: [],
      };
    },
    methods: {
      handleNodeClick(data){
        // console.log(data)
        this.branchName = data.BRANCHNAME
        this.branchNO = data.BRANCHNO
        this.popoverShow = false
        this.$emit('getBranchName', data)
      },
      // 查询机构
      async queryBranch() {
        let resBody = new branchQuery()
        resBody.data.BRANCHNO = this.branchNO
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == "000000") {
          this.resData = response.BODY.BRANCHDATA;
          this.toJson();
        } else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
      toJson() {
        let _this = this;
        Array.prototype.ToTreeJson = function (pid) {
          var result = [],
            temp;
          for (var i in this) {
            if (this[i].FATHERBRANCHID == pid) {
              // console.log("this", this[i]);
              result.push(this[i]);
              temp = _this.circlefn(this, this[i].BRANCHNO);
              if (temp.length > 0) {
                this[i].children = temp;
              }
            }
          }
          return result;
        }
        this.treedata = this.resData.ToTreeJson('00000');
        // console.log(this.treedata);
      },
      circlefn(data, pid) {
        var result = [],
          temp;
        for (var i in data) {
          if (data[i].FATHERBRANCHID == pid) {
            result.push(data[i]);
            temp = this.circlefn(data, data[i].BRANCHNO);
            if (temp.length > 0) {
              data[i].children = temp;
            }
          }
        }
        return result;
      },
    },
    watch: {
      
    },
    mounted() {
      this.queryBranch()
    },
    updated() {
      
    },
  };

</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  .el-input /deep/.el-input__inner {
    cursor: pointer;
  }

  .el-popover /deep/.el-input__inner {
    cursor: text;
  }
  .el-popover{
    width: auto !important;
    height: 400px !important;
    overflow: auto;
  }
</style>

